<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  	<title>表单设计预览</title>
  	<meta charset="UTF-8"/><%String path = request.getContextPath(); request.setAttribute("path",path);%>
	<script type="text/javascript">var CP = '${path}';</script>
	<script type="text/javascript" src="${path}/plug-in/jquery-easyui-1.5.1/jquery.min.js"></script>
	<script type="text/javascript" src="${path}/plug-in/jquery-easyui-1.5.1/jquery.easyui.min.js"></script>
	<link rel="stylesheet" type="text/css" href="${path}/plug-in/jquery-easyui-1.5.1/themes/icon.css"/>
	<link rel="stylesheet" type="text/css" href="${path}/plug-in/jquery-easyui-1.5.1/themes/default/easyui.css"/>
	<script type="text/javascript" src="${path}/plug-in/jquery-easyui-1.5.1/locale/easyui-lang-zh_CN.js"></script>
	
    <script src="${path}/plug-in/ueditor/ueditor.parse.js"></script>
    <script language="javascript" type="text/javascript" src="${path}/plug-in/My97DatePicker/WdatePicker.js"></script>
	<style type="text/css">
		button {margin-right:15px; }
	</style>
</head>
<body>
	<form id="jForm"  data-options="" action="">
		<div id="preview" style="margin:8px">${jform.formConfig}</div>
   	</form>
</body>	
  <script type="text/javascript">
	$(function(){
       uParse('#preview',{ chartContainerHeight:500 });
       
       /*隐藏属性渲染*/
       $("input[fplug=隐藏属性]").attr("type","hidden");
       
       /*时间日期选择*/
       $("input[fplug=日期选择]").addClass("Wdate").on("click",function(){
    	   WdatePicker({dateFmt:'yyyy-MM-dd'});
       });
       
       $("input[fplug=时间选择]").addClass("Wdate").on("click",function(){
    	   WdatePicker({dateFmt:'yyyy-MM-dd HH:mm'});
       });
       
       	/*数据字典渲染*/
      	$("select[fplug=数据字典]").each(function(){
      		var $this = $(this);
   	    	var url = $this.attr("url");
   	    	var options = ['<option value="">===</option>'];
   	     	$.get(url, function(data){
	   	     	 $.each(data,function(index,item) {
	   	     		options.push('<option value="'+ item.value +'">'+ item.text +'</option>');
				 });
	   	     	$this.append(options.join());
   	     	});
   	    });
       
       	/*行按钮渲染*/
       	$("button[fplug=添加行按钮]").on("click",function(){
       		var row = $(this).parent().parent().clone(true);
       		row.find("input").val("");
       		$(this).closest("table").append(row);
       	});
       	
       	/*行按钮渲染*/
       	$("button[fplug=删除行按钮]").on("click",function(){
       		var table = $(this).closest("table");
       		var len = table.find("button[fplug=删除行按钮]").length;
       		if(len==1){return false;}
       		$(this).parent().parent().remove();
       	});
       	
 	});
	</script>
</html>
